<template>
    <div class="content">
        <van-form @submit="onSubmit" validate-first @failed="onFailed">
<!--            <div class="subtitle">注：数据在不断汇聚和完善中，查询结果仅供参考。</div>-->
            <div class="title">基础信息</div>
            <van-field
                    v-model="healthInfo.person.desensitizeName"
                    name="name"
                    label="真实姓名"
                    disabled
            />
            <van-field
                    v-model="healthInfo.person.desensitizeCardId"
                    name="card_no"
                    label="身份证号"
                    disabled
            />
            <div class="title">确诊、疑似患者查询结果</div>
            <van-field
                    input-align="right"
                    v-model="healthInfo.yqWarn.warnType"
                    name="warnType"
                    label="是否为确诊或疑似患者？"/>
            <div class="title">同行密接查询结果</div>
            <van-field
                    input-align="right"
                    v-model="getmijie"
                    disabled
                    name="rjmj"
                    label="是否与确诊或疑似患者同行密切接触？"/>
            <div class="subtitle">同行密接数据为：截止当前日期的14天内，和确诊或疑似患者同乘火车、飞机前后三排（共七排）及同一客车或客船的相关人员。</div>
            <div class="title">已关联的地方健康码信息</div>
            <van-field
                    input-align="right"
                    v-model="healthInfo.healthyReport[0].dataSource"
                    name="dataSource"
                    label="数据来源"
                    disabled
            />
            <van-field
                    input-align="right"
                    v-model="getFengXian"
                    name="healthyStaus"
                    label="健康状态"
                    disabled
            />
            <van-field
                    input-align="right"
                    v-model="healthInfo.healthyReport[0].date"
                    label="健康报告日期"
                    disabled
            />
            <div v-if="healthInfo.yqReports.length>0">
                <div class="title">健康申报信息</div>
                <van-field
                        input-align="right"
                        v-model="healthInfo.yqReports[0].date"
                        label="健康打卡时间"
                        disabled
                />
                <van-field
                        input-align="right"
                        v-model="healthInfo.yqReports[0].city"
                        label="当前居住地址"
                        disabled
                />
                <!--            <van-field-->
                <!--                    v-model="healthInfo.yqReports[0].date"-->
                <!--                    name="date"-->
                <!--                    label="居住地风险等级"-->
                <!--                    disabled-->
                <!--            />-->
                <van-field
                        input-align="right"
                        v-model="isContactPatient"
                        name="date"
                        label="近14天内您是否接触新冠肺炎确诊或疑似患者"
                        disabled
                />
                <van-field
                        input-align="right"
                        v-model="symptom"
                        name="date"
                        label="当前健康状态"
                        disabled
                />
                <van-field
                        input-align="right"
                        v-model="healthInfo.yqReports[0].temperature"
                        name="date"
                        label="当前体温(℃)"
                        disabled
                />
                <van-field
                        input-align="right"
                        v-model="healthInfo.yqReports[0].phone"
                        name="date"
                        label="联系电话"
                        disabled
                />
                <div class="subtitle">注：个人填写的健康申报数据仅供参考，不作为出行异常提醒判定依据。</div>
            </div>

<!--            <van-field-->
<!--                    v-model="healthInfo.healthyReport[0].dataSource"-->
<!--                    name="dataSource"-->
<!--                    label="数据上报"-->
<!--                    disabled-->
<!--            />-->
<!--            <van-field-->
<!--                    v-model="getFengXian"-->
<!--                    name="healthyStaus"-->
<!--                    label="风险等级"-->
<!--                    disabled-->
<!--            />-->
            <!--            <div class="title">{{healthInfo.rjmj.from}}</div>-->
            <!--            <recent-situation ref="recentSituation" :formData="formItem"></recent-situation>-->
<!--            <div>-->
<!--                <div class="title">其他信息</div>-->
<!--                <van-field-->
<!--                        v-model="healthInfo.rjmj.bingli"-->
<!--                        disabled-->
<!--                        name="rjmj"-->
<!--                        label="人员状态"/>-->
<!--                <van-field v-model="healthInfo.rjmj.from" disabled-->
<!--                           name="rjmj" label="数据来源"/>-->
<!--                <van-field-->
<!--                        v-if="healthInfo.yqWarn.warnType"-->
<!--                        v-model="healthInfo.yqWarn.warnType"-->
<!--                        name="warnType"-->
<!--                        disabled-->
<!--                        label="风险类型"/>-->
<!--                <van-field-->
<!--                        v-if="healthInfo.yqWarn.fbrq"-->
<!--                        v-model="healthInfo.yqWarn.fbrq"-->
<!--                        name="fbrq"-->
<!--                        disabled-->
<!--                        label="发病日期"-->
<!--                />-->
<!--                <van-field-->
<!--                        v-if="healthInfo.yqWarn.qzrq"-->
<!--                        v-model="healthInfo.yqWarn.qzrq"-->
<!--                        name="qzrq"-->
<!--                        disabled-->
<!--                        label="确诊日期"-->
<!--                />-->
<!--                <van-field-->
<!--                        v-if="healthInfo.yqWarn.jcrq"-->
<!--                        v-model="healthInfo.yqWarn.jcrq"-->
<!--                        name="jcrq"-->
<!--                        disabled-->
<!--                        label="接触日期"-->
<!--                />-->
<!--                <van-field-->
<!--                        v-if="healthInfo.yqWarn.mdtrtDate"-->
<!--                        v-model="healthInfo.yqWarn.mdtrtDate"-->
<!--                        name="mdtrtDate"-->
<!--                        disabled-->
<!--                        label="入院时间"-->
<!--                />-->
<!--                <van-field-->
<!--                        v-if="healthInfo.yqWarn.dscgDate"-->
<!--                        v-model="healthInfo.yqWarn.dscgDate"-->
<!--                        name="dscgDate"-->
<!--                        disabled-->
<!--                        label="出院时间"-->
<!--                />-->
<!--                <van-field-->
<!--                        v-if="healthInfo.yqWarn.from"-->
<!--                        v-model="healthInfo.yqWarn.from"-->
<!--                        name="name"-->
<!--                        disabled-->
<!--                        label="数据来源"-->
<!--                />-->
<!--            </div>-->
<!--            <div v-if="healthInfo.yqReports.length>0">-->
<!--                <div class="title">健康打卡记录</div>-->
<!--                <van-field-->
<!--                        v-model="healthInfo.yqReports[0].date"-->
<!--                        name="name"-->
<!--                        disabled-->
<!--                        label="打卡时间"-->
<!--                />-->
<!--                <van-field-->
<!--                        v-model="healthInfo.yqReports[0].city"-->
<!--                        name="name"-->
<!--                        disabled-->
<!--                        label="所在城市"-->
<!--                />-->
<!--                <van-field-->
<!--                        v-model="symptom"-->
<!--                        name="name"-->
<!--                        disabled-->
<!--                        label="健康状态"-->
<!--                />-->
<!--                <van-field-->
<!--                        v-model="healthInfo.yqReports[0].temperature"-->
<!--                        name="name"-->
<!--                        disabled-->
<!--                        label="当日体温（℃）"-->
<!--                />-->
<!--                <van-cell title="近14天您是否曾经在湖北省居住或到过湖北省？"/>-->
<!--                <van-field name="isGoHubeiWH">-->
<!--                    <template #input>-->
<!--                        <van-radio-group disabled v-model="healthInfo.yqReports[0].isGoHubeiWH" direction="horizontal">-->
<!--                            <van-radio name="2" icon-size="22px">否</van-radio>-->
<!--                            <van-radio name="1" icon-size="22px">是</van-radio>-->
<!--                        </van-radio-group>-->
<!--                    </template>-->
<!--                </van-field>-->
<!--                <van-cell title="近14天内您是否接触新冠肺炎确诊或疑似患者？"/>-->
<!--                <van-field name="isContactPatient">-->
<!--                    <template #input>-->
<!--                        <van-radio-group disabled v-model="healthInfo.yqReports[0].isContactPatient"-->
<!--                                         direction="horizontal">-->
<!--                            <van-radio name="2" icon-size="22px">否</van-radio>-->
<!--                            <van-radio name="1" icon-size="22px">是</van-radio>-->
<!--                        </van-radio-group>-->
<!--                    </template>-->
<!--                </van-field>-->
<!--            </div>-->
        </van-form>
    </div>
</template>

<script>
// 接口
import { updatePermitUserMsg, getOpenidInfo, getHealthInfo } from '@/api/yi-qing-fang-kong.js'
// 工具
import { identityCodeValid, identityMobile } from '@/libs/tools'
// 组件
// import AreaPage from './components/area-page/index'
// import RecentSituation from './components/recent-situation/index'
// import wx from 'weixin-js-sdk'

export default {
  // components: { RecentSituation, AreaPage },
  data () {
    this.idCardRules = [
      { required: true, message: '请输入证件号' },
      { validator: this.idCardValidator, message: '证件号不正确' }
    ]
    this.phoneRules = [
      { required: true, message: '请输入手机号' },
      { validator: this.phoneValidator, message: '手机号格式错误' }
    ]
    // this.codeRules = [
    //   { required: true, message: '请输入验证码' },
    //   { validator: this.codeValidator, message: '验证码错误' }
    // ]
    return {
      symptom: '',
      formItem: {
        // 表单数据
        name: '',
        card_no: '',
        tel: '',
        area_type: '', // 区域类型
        area_id: '',
        street_id: '',
        community_id: '',
        area: '',
        street: '',
        community: '',
        loc_province: '', // 地图选取后的省
        loc_city: '', // 地图选取后的市
        loc_title: '', // 地图选取后的地址名
        loc_address: '', // 地图选取后的具体地址
        house_num: '', // 门牌号
        is_hubei: '',
        is_contact: '',
        health_state: '',
        temp: ''
      },
      healthInfo: {},
      loading: false,
      updataState: true,
      loadingText: '加载中',
      btnText: '提交',
      disabled: false,
      routeObj: {} // 路由对象
    }
  },
  methods: {
    failNotice (title) {
      this.$notify({ type: 'danger', message: title })
    },
    idCardValidator (val) {
      // 身份证
      const reg1 = identityCodeValid(val)
      if (!reg1.pass) {
        // this.failNotice('请检查身份证格式！')
        return false
      }
    },
    phoneValidator (val) {
      return identityMobile(val)
    },
    onFailed (errorInfo) {
      this.failNotice(errorInfo.errors[0].message)
      console.log('failed', errorInfo)
    },
    onSubmit (value) {
      console.log('表单提交', value)
      if (this.formItem.card_no === '' || this.formItem.card_no === undefined || this.formItem.card_no === null) {
        this.$dialog.alert({
          message: '请输入身份证号!'
        })
        return false
      }
      // 区域部分
      let areaPageData = this.$refs.areaPage.checkForm()
      // 姓名去空格处理
      this.formItem.name.toString().replace(/\s/ig, '')
      // 手机号去空格处理
      this.formItem.tel.toString().trim()
      // 身份证去空格处理
      this.formItem.card_no.toString().trim()

      console.log('区域组件', areaPageData)
      let recentSituationData = this.$refs.recentSituation.checkForm()
      console.log('其它信息组件', recentSituationData)
      if (areaPageData && recentSituationData) {
        // if (areaPageData) {
        // 组件数据处理
        this.formItem.area_type = areaPageData.area_type
        this.formItem.area_id = areaPageData.area.id
        this.formItem.area = areaPageData.area.text
        this.formItem.street_id = areaPageData.street.id
        this.formItem.street = areaPageData.street.text
        this.formItem.community_id = areaPageData.community.id
        this.formItem.company_code = !this.$common.xeUtils.isEmpty(areaPageData.community.company_code) ? areaPageData.community.company_code : areaPageData.street.company_code
        this.formItem.community = areaPageData.area_type === '1' ? areaPageData.community.text : areaPageData.cunValue
        this.formItem.house_num = areaPageData.house_num
        this.formItem.loc_title = areaPageData.title
        this.formItem.loc_address = areaPageData.address
        this.formItem.loc_province = areaPageData.province
        this.formItem.loc_city = areaPageData.city
        this.formItem.longitude = areaPageData.lng
        this.formItem.latitude = areaPageData.lat
        this.formItem.address = this.formItem.loc_province + this.formItem.loc_city + this.formItem.loc_title + this.formItem.loc_address
        this.formItem.is_hubei = recentSituationData.is_hubei
        this.formItem.is_contact = recentSituationData.is_contact
        this.formItem.health_state = recentSituationData.health_state_copy.join('^')
        this.formItem.health_state.replace(/,/g, '^')
        this.formItem.temp = recentSituationData.temp
        this.formItem.stay_city = recentSituationData.stay_city
        // 移除arrive_time防止sql报错
        this.$delete(this.formItem, 'arrive_time')
        // 校验成功后插入
        this.updatePermitAction()
      }
    },
    // 表单提交
    updatePermitAction () {
      console.log('表单最终提交内容', this.formItem)
      // type不为2时姓名、身份证号、手机号移除
      let item = this.$common.xeUtils.clone(this.formItem)
      if (this.updataState) {
        this.$delete(item, 'name')
        this.$delete(item, 'card_no')
      }
      updatePermitUserMsg(item).then(ret => {
        if (ret.data.errcode === 0) {
          console.log('保存回调', ret.data.data)
          this.$dialog.alert({
            message: '保存成功!'
          }).then(() => {
            this.$router.push({
              name: 'epidemic-submit-success',
              query: {}
            })
          })
        } else {
          this.failNotice(ret.data.errmsg + '/sid/' + ret.data.sid)
        }
      })
    },
    getOpenidMsgAction () {
      getOpenidInfo().then(ret => {
        if (ret.data.errcode === 0) {
          console.log('获取注册过的人员信息', ret.data)
          let data = ret.data.data
          if (!this.$common.xeUtils.isEmpty(data)) {
            this.formItem = data
            if (this.formItem.type === 3 || this.formItem.type === 8) {
              this.disabled = true
              this.btnText = '无法提交'
            } else {
              this.disabled = false
              this.btnText = '提交'
            }
            this.updataState = this.formItem.type !== '2'
            this.autoDataHandle()
          } else {
            this.$router.push({
              name: 'epidemic-submit-new',
              query: {}
            })
          }
        } else if (ret.data.errcode === 9998) {
          this.$dialog.alert({
            message: '保存成功!'
          }).then(() => {
            this.$router.push({
              name: 'epidemic-submit-new',
              query: {}
            })
          })
        } else {
          this.failNotice(ret.data.errmsg)
        }
      })
    },
    // 去苹果机型白边
    bodyScrollTop () {
      winToTop()
    },
    // 回显数据处理
    autoDataHandle () {
      console.log('当前表单', this.formItem)
    },
    getHealthInfoAction () {
      getHealthInfo({ BizType: '0120' })
      getHealthInfo({ BizType: '0113' }).then(ret => {
        if (ret.data.errcode === 0) {
          this.healthInfo = ret.data.data
          for (let i = 0; i < this.healthInfo.yqReports[0].symptom.length; i++) {
            if (this.healthInfo.yqReports[0].symptom[i] === '1') {
              this.symptom += '没有出现症状；'
            }
            if (this.healthInfo.yqReports[0].symptom[i] === '2') {
              this.symptom += '感冒样症状：乏力、咳嗽、发烧、肌肉疼、头疼；'
            }
            if (this.healthInfo.yqReports[0].symptom[i] === '3') {
              this.symptom += '喘憋、呼吸急促；'
            }
            if (this.healthInfo.yqReports[0].symptom[i] === '4') {
              this.symptom += '恶心呕吐、腹泻；'
            }
            if (this.healthInfo.yqReports[0].symptom[i] === '5') {
              this.symptom += '心慌、胸闷；'
            }
            if (this.healthInfo.yqReports[0].symptom[i] === '6') {
              this.symptom += '结膜炎（红眼病样症状：眼睛涩、红、分泌物）'
            }
          }
        } else {
          this.failNotice(ret.data.errmsg)
        }
      })
    }
  },
  mounted () {
    // this.$dialog.alert({
    //   title: '温馨提示',
    //   message: '每人只可修改一次'
    // })
    // 获取路由信息
    this.routeObj = this.$route.query
    console.log('表单页面路由信息', this.routeObj)
    // 获取填报信息
    // this.getOpenidMsgAction()

    this.getHealthInfoAction()
  },
  computed: {
    isContactPatient () {
      if (this.healthInfo.yqReports[0].isContactPatient === '2') {
        return '否'
      } else {
        return '是'
      }
    },
    getmijie () {
      if (this.healthInfo.rjmj.bingli === '非密接人员') {
        return '否'
      } else {
        return '是'
      }
    },
    getFengXian () {
      if (this.healthInfo.healthyReport[0].healthyStaus == '10') {
        return '高风险'
      }
      if (this.healthInfo.healthyReport[0].healthyStaus == '01') {
        return '中风险'
      }
      return '低风险'
    }
  },
  watch: {}
}
</script>

<style scoped>
    .address-box {
        text-align: left;
    }

    .van-radio {
        float: left;
        margin-right: 10px;
    }

    .van-popup /deep/ .van-ellipsis {
        font-size: 0.95rem;
    }

    .title {
        width: 100%;
        padding: 0.625rem 0.9375rem;
        font-size: 12px;
    }

    .action-item .van-cell__title {
        -webkit-box-flex: inherit;
        -webkit-flex: inherit;
        flex: inherit;
        width: 5.625rem;
    }

    .content {
        width: 100%;
        background-color: #F5F5F5;
        box-sizing: border-box;
        -webkit-box-sizing: border-box;
    }

    .content >>> .van-cell {
        margin: 0 2%;
        width: 96%;
        font-size: 12px;
    }

    .content >>> .van-dialog__content {
        padding: 10px;
        text-align: center;
    }

    .van-field__control {
        font-size: 12px;
    }

    .content >>> .van-cell__value .van-field__body .van-field__control {
        font-size: 12px;
    }

    .div-bot {
        margin: 10px;
        margin-bottom: 60px;
    }

    .div-bot >>> .van-button--info {
        border: 1px solid #75ACDC;
    }

    .div-bot >>> .van-button {
        height: 2.5rem;
    }

    .city-card-common-btn {
        color: white;
        font-size: 12px;
        padding: 0;
        width: 100%;
        border-radius: 5px;
        text-align: center;
        background-color: #75ACDC;
    }

    .content >>> .van-cell__value {
        /*flex: inherit;*/
        font-size: 12px;
    }

    .content >>> .van-cell__value {
        text-align: left;
    }

    .content >>> .value-item .van-cell__value {
        width: 100%;
    }

    .van-action-sheet__cancel, .van-action-sheet__item {
        font-size: 12px;
    }

    .van-cell__value span {
        /*color: black;*/
    }

    .van-dropdown-menu {
        height: 25px;
    }

    .van-hairline--top-bottom::after {
        border-width: 0px 0px;
    }

    .chaochu >>> .van-cell__value {
        width: 100%;
    }

    .div1 >>> .van-cell__value {
        width: 100%;
    }

    .div2 >>> .van-cell__value {
        width: 100%;
    }

    .other-info .van-field__label.radio-item, .tou .van-field__label.radio-item {
        width: 8.625rem;
    }

    .suggest.van-cell.van-field span {
        width: 5rem;
    }

    .content >>> .van-cell__value {
        text-align: right;
    }
    .subtitle{
        padding: 5px 0.9375rem;
        font-size: 12px;
        color: red;
    }
</style>
